<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>

<body>
  <p>我是一个p标签01</p>
  <!-- <script>
    console.log('start')
    setTimeout(() => {
      console.log('timeout')
    })
    Promise.resolve().then(() => {
      console.log('promise then')
    })
    console.log('end')
  </script> -->

  <script>
    const p = document.createElement('p');
    p.innerHTML = '我是一个p标签02';
    document.body.appendChild(p);

    const list = document.getElementsByTagName('p')
    console.log('length----', list.length)

    console.log('start')
    setTimeout(() => {
      const list = document.getElementsByTagName('p')
      console.log('length----', list.length)
      alert("阻塞 timeout")
    })
    Promise.resolve().then(() => {
      const list = document.getElementsByTagName('p')
      console.log('length----', list.length)
      alert("阻塞 promise")
    })
    console.log('end')
  </script>
</body>

</html>